import {Card, MarkdownRender} from "@douyinfe/semi-ui";
import {useEffect, useState} from "react";

const Introduction = () => {
    const [markdownContent, setMarkdownContent] = useState('');
    useEffect(() => {
        const fetchMarkdown =  async () => {
            try {
                const response = await fetch('assets/intro.md');
                if (response.ok) {
                    return await response.text()

                }
            } catch { /* empty */}
            return ""
        };

        fetchMarkdown().then(value => setMarkdownContent(value));
    }, []);
    return (<div style={{flexGrow: 1, margin: 20}}>
        <Card
            bordered={true}
            headerLine={true}
            title='开始说明'
        >
            <MarkdownRender raw={markdownContent}/>
        </Card>
    </div>)
}
export default Introduction